<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>工厂模式—抽象工厂</title>
</head>
<body>
  <script>
    class MobilePhoneFactory {
      // 提供操作系统的借口
      createOS() {
        throw new Error('抽象工厂方法不允许直接调用，你需要将我重写');
      }
      createHardWare() {
        throw new Error('抽象工厂方法不允许直接调用，你需要将我重写');
      }
    }
    class FakeStarFactory extends MobilePhoneFactory {
      createOS() {
        return new AppleOS();
      }
      createHardWare() {
        return new MiWare();
      }
    }

    /**
     * 操作系统
     */
    class OS {
      controlHardWare() {
        throw new Error('抽象产品方法不允许直接调用，你需要将我重写');
      }
    }
    class AndroidOS extends OS{
      controlHardWare() {
        console.log('我会用安卓的方法去操作硬件');
      }
    }
    class AppleOS extends OS{
      controlHardWare() {
        console.log('我会用苹果的方式去操作硬件');
      }
    }

    /**
     * 系统硬件
     */
    class HardWare {
      operateByOrder() {
        throw new Error('抽象产品不允许直接调用，你需要将我重写');
      }
    }

    class QualcommHardWare extends HardWare {
      operateByOrder() {
        console.log('我会用高通的方式去运转');
      }
    }

    class MiWare extends Headers{
      operateByOrder() {
        console.log('我会用小米的方式去运转');
      }
    }

    const myPhone = new FakeStarFactory();
    const myOS = myPhone.createOS();
    const myHardWare = myPhone.createHardWare();
    myOS.controlHardWare();
    myHardWare.operateByOrder();
  </script>
</body>
</html>